<template>
	<el-dialog
		title="字段可见配置"
		:visible.sync="settingShow"
		width="35%"
		:before-close="cancel"
		:close-on-click-modal="false"
		:close-on-press-escape="false"
	>
		<el-cascader
			style="width: 100%"
			collapse-tags
			v-model="defaultCheckList"
			:options="treeData"
			:props="props"
			clearable
			filterable
		></el-cascader>
		<span slot="footer" class="dialog-footer">
			<el-button @click="cancel" size="small">取 消</el-button>
			<el-button type="primary" @click="addConfirm" size="small">确 定</el-button>
		</span>
	</el-dialog>
</template>
<script>
import { uploadVisibility } from '@/api/productApi/fieldManagement'
export default {
	props: {
		settingShow: {
			type: Boolean,
			default: false
		},
		settingShowFunc: {
			type: Function,
			default: Function
		},
		treeData: {
			type: Array,
			default: Array
		},
		dataBeforeProces: {
			type: Array,
			default: Array
		},
		getData: {
			type: Function,
			default: Function
		}
	},

	data() {
		return {
			props: {
				children: 'childNodeList',
				label: 'fieldName',
				multiple: true,
				value: 'fieldId'
			},
			form: {
				viewIdList: []
			},
			defaultCheckList: [],
			treeKey2: 1
		}
	},

	mounted() {},

	methods: {
		cancel() {
			this.treeKey2 += 1
			this.$emit('settingShowFunc')
		},

		// 新增或编辑
		addConfirm() {
			const obj = {
				seeingIdList: [],
				unseenIdList: []
			}
			this.defaultCheckList.forEach(item => {
				obj.seeingIdList.push(...item)
			})
			obj.seeingIdList = [...new Set(obj.seeingIdList)]
			this.dataBeforeProces.forEach(item => {
				if (!obj.seeingIdList.includes(item.fieldId)) {
					obj.unseenIdList.push(item.fieldId)
				}
			})
			uploadVisibility(obj)
		},

		edit() {
			this.dataBeforeProces.forEach(item => {
				if (item.isVisible === '0') {
					this.defaultCheckList.push(item.fieldId)
				}
			})
		}
	}
}
</script>
<style lang="scss" scoped ></style>
